/* eslint-disable react/no-unused-state, no-plusplus */
import React, { Component } from 'react';
import { Table, Switch, Icon, Button, Grid, Pagination } from '@icedesign/base';
import IceContainer from '@icedesign/container';
import axios from 'axios';
import cookie from 'react-cookies';
import UserSearch from '../UserSearch';

const { Row, Col } = Grid;

export default class UserTable extends Component {
  static displayName = 'UserTable';

  static propTypes = {};

  static defaultProps = {};

  constructor(props) {
    super(props);
    this.state = {
      formValue: {},
      current: 1,
      tableData: [],
    };
  }

  formChange = (value) => {
    console.log('changed value', value);
    this.setState({
      formValue: value,
      filterFormValue: {},
    });
  };

  componentWillMount() {
    const sessionid = cookie.load('sessionId');
    const baseurl = 'http://39.105.21.199:8989/IPEvaluation/userMamage/showUserList.do?sessionId='
    axios.post(baseurl + sessionid).then((response) => {
      const entityList = response.data.data.entityList;
      console.log(entityList);
      this.setState({ tableData: entityList });
      // for (let i = 0; i < entityList.length; i++) {
      //   result.push({
      //     id: i + 1,
      //     name: entityList[i].uDepartment,
      //     type: entityList[i].rName,
      //
      //   });
      // }
      // console.log('result', result);
      // return result;
    }).catch((error) => {
      console.log(error);
    });
  }
  filterFormChange = (value) => {
    console.log('onchange', value);
    this.setState({
      filterFormValue: value,
    });
  };
  filterTable = () => {
    // 合并参数，请求数据
    console.log(this.state.filterFormValue);
    this.queryCache = {
      ...this.queryCache,
      ...this.state.filterFormValue,
    };
    const baseurl = 'http://39.105.21.199:8989/IPEvaluation/userMamage/showUserList.do';
    const data = this.state.filterFormValue;
    const sessionid = cookie.load('sessionId');
    if (typeof (this.state.filterFormValue.date) === 'undefined') {
      console.log('shijianweikong');
      const params = new URLSearchParams();
      params.append('sessionId', sessionid);
      params.append('rName', this.state.filterFormValue.type);
      axios.post(baseurl, params).then((response) => {
        console.log(response);
        const entityList = response.data.data.entityList;
        console.log('date没填', entityList);
        this.setState({ tableData: entityList });
        // if (typeof (entityList === 'undefined')) {
        //   this.setState({ tableData: [] });
        // }
      }).catch((error) => {
        console.log(error);
      });
    }
    if (typeof (this.state.filterFormValue.type) === 'undefined') {
      console.log('leixingweikong', this.state.formValue.type);
      const params = new URLSearchParams();
      params.append('sessionId', sessionid);
      const date = this.state.filterFormValue.date;
      params.append('startDate', date[0]);
      params.append('endDate', date[1]);
      axios.post(baseurl, params).then((response) => {
        console.log(response);
        const entityList = response.data.data.entityList;
        console.log('type没填', entityList);
        this.setState({ tableData: entityList });
        // if (typeof (entityList === 'undefined')) {
        //   this.setState({ tableData: [] });
        // }
      }).catch((error) => {
        console.log(error);
      });
    }
    if (typeof (this.state.filterFormValue.type) !== 'undefined' && typeof (this.state.filterFormValue.date) !== 'undefined') {
      console.log('doubuweikong');
      const params = new URLSearchParams();
      params.append('sessionId', sessionid);
      params.append('rName', this.state.filterFormValue.type);
      const date = this.state.filterFormValue.date;
      params.append('startDate', date[0]);
      params.append('endDate', date[1]);
      axios.post(baseurl, params).then((response) => {
        console.log(response);
        const entityList = response.data.data.entityList;
        console.log('date-type', entityList);
        this.setState({ tableData: entityList });
        // if (typeof (entityList === 'undefined')) {
        //   this.setState({ tableData: [] });
        // }
      }).catch((error) => {
        console.log(error);
      });
    }

    // }
  };

  resetFilter = () => {
    this.setState({
      filterFormValue: {},
    });
  };
  getData = () => {
    const result = [];
    for (let i = 0; i < this.state.tableData.length; i++) {
      result.push({
        id: this.state.tableData[i].uId,
        name: this.state.tableData[i].uAccount,
        type: this.state.tableData[i].rName,
        date: this.state.tableData[i].uRegistedate,
        status: this.state.tableData[i].uStatus,
        // college: '计算机',
        // class: i + 1,
        // phone: `1876666123${i}`,
        // role: '管理员',
      });
    }
    console.log('result', result);
    return result;
  };

  onChange = (...args) => {
    console.log(...args);
  };

  handlePaginationChange = (current) => {
    this.setState({
      current,
    });
  };
  deleteItem = (index, record) => {
    console.log(index);
    console.log(record);
    const uId = record.id;
    console.log('uid', uId);
    const sessionid = cookie.load('sessionId');
    const deletebaseurl = 'http://39.105.21.199:8989/IPEvaluation/userMamage/userDelete.do'
    const params = new URLSearchParams();
    params.append('sessionId', sessionid);
    params.append('uId', uId);
    console.log(uId);
    axios.post(deletebaseurl, params).then((response) => {
      console.log(response);
    }).catch((error) => {
      console.log(error);
    });
    // this.state.dataSource.splice(index, 1);
    // this.setState({
    //   dataSource: this.state.dataSource,
    // });
  };

  renderOper = (value, index, record) => {
    console.log('shujurecord', record);
    return (
      <Button onClick={this.deleteItem.bind(this, index, record)} shape="text">
        删除
      </Button>
    );
  };

  render() {
    const { filterFormValue } = this.state;
    console.log('tabledata', this.getData());
    return (
      <IceContainer title="用户列表">
        <UserSearch
          value={filterFormValue}
          onChange={this.filterFormChange}
          onSubmit={this.filterTable}
          onReset={this.resetFilter}
        />
        {/*<Row wrap style={styles.headRow}>*/}
          {/*<Col l="12">*/}
            {/*<Button type="primary" style={styles.button}>*/}
              {/*<Icon type="add" size="xs" style={{ marginRight: '4px' }} />添加用户*/}
            {/*</Button>*/}
          {/*</Col>*/}
          {/*<Col l="12" style={styles.center}>*/}
            {/*<Button type="normal" style={styles.button}>*/}
              {/*删除*/}
            {/*</Button>*/}
            {/*<Button type="normal" style={{ ...styles.button, marginLeft: 10 }}>*/}
              {/*导入*/}
            {/*</Button>*/}
            {/*<Button type="normal" style={{ ...styles.button, marginLeft: 10 }}>*/}
              {/*下载*/}
            {/*</Button>*/}
          {/*</Col>*/}
        {/*</Row>*/}
        <Table
          dataSource={this.getData()}
          rowSelection={{ onChange: this.onChange }}
        >
          <Table.Column title="序号" dataIndex="id" width={100} />
          <Table.Column title="账号" dataIndex="name" width={200} />
          <Table.Column title="类型" dataIndex="type" width={200} />
          <Table.Column title="注册时间" dataIndex="date" width={200} />
          <Table.Column title="状态" dataIndex="status" width={100} />
          {/*<Table.Column title="联系电话" dataIndex="phone" width={200} />*/}
          {/*<Table.Column title="角色" dataIndex="role" width={200} />*/}
          {/*<Table.Column title="启动/停用" width={100} cell={() => <Switch />} />*/}
          <Table.Column title="操作" width={100} cell={this.renderOper} />
        </Table>
        {/*<Pagination*/}
          {/*style={styles.pagination}*/}
          {/*current={this.state.current}*/}
          {/*onChange={this.handlePaginationChange}*/}
        {/*/>*/}
      </IceContainer>
    );
  }
}

const styles = {
  headRow: {
    marginBottom: '10px',
  },
  icon: {
    color: '#2c72ee',
    cursor: 'pointer',
  },
  deleteIcon: {
    marginLeft: '20px',
  },
  center: {
    textAlign: 'right',
  },
  button: {
    borderRadius: '4px',
  },
  pagination: {
    marginTop: '20px',
    textAlign: 'right',
  },
};
